<template>
  <div>
    <song-list :list="list" mode="rank" />
  </div>
</template>

<script>
// import eventBus from '@/event-bus';
import { mapState, mapActions } from 'vuex';

export default {
  computed: {
    // 模块名, 字段数组
    ...mapState('hotSong', ['info']),
    list () {
      return this.info.playlist?.tracks
        .slice(0, 20)
        .map((item, i) => ({
          id: item.id,
          name: item.name, // 歌曲名
          maxBr: this.info.privileges[i].downloadMaxbr, // 最大音质
          alias: item.alia[0], // 别名
          artists: item.ar, // 歌手数组
          albumName: item.al.name, // 专辑名
        }));
    },
  },
  methods: {
    ...mapActions('hotSong', ['updateInfo']),
  },
  created () {
    this.updateInfo();
  },
}
</script>

<style scoped>

</style>